<template>
	<view>
		 <!-- <u-navbar :is-back="true" :is-fixed="true" title="品牌积分榜"></u-navbar> -->
		<scroll-view ref="scrollView" scroll-y scroll-with-animation style="height: calc(100vh - 50px);"
			:show-scrollbar="false" @scrolltolower="loadMore" @scrolltoupper="refresh">
			<view class="mt-3 pl-2 pr-2">
				<view v-for="(item, itemIndex) in brandPointsList" :key="itemIndex" class="border-f5f5f5">
					<view class="dfex mt-3 pb-3">
						<view class="dfes">
							<view
								:class="['pr-2 font-20', {'index-color-1': (itemIndex % 3) === 0 && itemIndex < 3, 'index-color-2': (itemIndex % 3) === 1 && itemIndex < 3, 'index-color-3': (itemIndex % 3) === 2 && itemIndex < 3, 'font-color-gray': itemIndex >= 3 }]">
								{{ itemIndex + 1 }}
							</view>
							<u-image style="width: 35px; height: 35px; margin-top: 10rpx;" border-radius= "100rpx" :src="getFullImageUrl(item.avatar)" ></u-image >
							<text class="ml-2 font-15 text-333333 wrap">{{ item.enterpriseName }}</text>
						</view>
						<text class="text-78AB06 font-16">{{ item.totalIntegral }} 积分</text>
					</view>
				</view>
			</view>
			<view v-if="!hasMore && brandPointsList.length > 0" class="text-center mt-3 mb-3">
				<view class="text-muted">没有更多数据了</view>
			</view>
			<view v-else-if="!hasMore && brandPointsList.length === 0" class="text-center mt-3 mb-3">
				<view class="iconfont text-999999 icon-zanwushuju font-48 pb-1"></view>
				<view class="text-999999 font-15">暂无数据</view>
			</view>
			<view v-else class="text-center mt-3 mb-3">
				<view class="btn btn-primary">加载更多</view>
			</view>
		</scroll-view>
	</view>
</template>

<script>
	import $H from '@/common/free-lib/request.js';
	import {
		getImageUrl
	} from '@/common/free-lib/util.js';
	export default {
		data() {
			return {
				brandPointsList: [],
				form: {
					pageNo: 1,
					pageSize: 10,
					total: 0 // 总页数
				},
				hasMore: true, // 是否还有更多数据

			}
		},
		onLoad() {
			this.brandPoints();
		},
		methods: {
			getFullImageUrl(imagePath) {
				return getImageUrl(imagePath);
			},
			setDefaultPageConfig() {
				this.form.pageNo = 1
				this.form.pageSize = 10
				this.form.total = 0
			},
			// 品牌积分榜
			brandPoints() {
				$H.get('/basisInform/integral/agriculture/queryIntegralStandingsPageList', {...this.form},{}).then(res => {
					this.brandPointsList = res.result.records;
					this.form.total = res.result.total;
					this.hasMore = this.brandPointsList.length < this.form.total;
				}).catch(error => {
					uni.showToast({
						title: "网络错误，请稍后再试",
						icon: 'none'
					});
				});
			},
			// 加载更多
			loadMore() {
			
				if (this.form.pageNo * this.form.pageSize >= this.form.total) {
					this.hasMore = false;
					return;
				}
				this.form.pageNo++;
				// 请求数据
				this.brandPoints();
			},
			// 下拉刷新
			refresh() {
				// 重置页码为 1
				this.form.pageNo = 1;
				// 清空数据列表
				this.brandPointsList = [];
				// 设置标记为有更多数据
				this.hasMore = true;
				// 重新请求数据
				this.brandPoints();
				// 结束下拉刷新动画
				uni.$emit('stopPullDownRefresh');
			},
		}
	}
</script>

<style>
	.index-color-1 {
		font-size: 22px;
		color: #FF0000;
	}

	.index-color-2 {
		font-size: 22px;
		color: #17a2b8;
	}

	.index-color-3 {
		font-size: 22px;
		color: #FFC251;
	}
</style>